<script setup lang='ts'>

</script>
<template>
    <div class="waiting box bg clmcenter">
        <div class="tipsbox">
            <img src="../assets/img/drink.png" class="proimg" />
            <div class="progressbox">
                <div class="line"></div>
            </div>
            <p class="tips">
                打印中... <br>
                请耐心等待
            </p>
        </div>
        <img src="@/assets/img/btn_back.png" class="btn_back"
            @click="$router.replace({ path: '/index', query: { canprint: 0 } })" />
    </div>
</template>

<style lang="scss" scoped>
.waiting {
    .tipsbox {
        text-align: center;

        .proimg {
            width: 87px;
        }

        .progressbox {
            margin-top: 43px;
            position: relative;
            width: 424px;
            height: 7px;
            background-color: #000000;
            border-radius: 10px;

            .line {
                width: 35%;
                height: 100%;
                background-color: #eee3b4;
                border-radius: 10px;
            }
        }

        .tips {
            font-size: 24px;
            color: #eee3b4;
            margin-top: 39px;
            letter-spacing: 2px;
            opacity: 0.63;
        }
    }

    .btn_back {
        position: absolute;
        bottom: 200px;
        width: 371px;
    }
}
</style>